<template>
    <div class="classic-demo">
        <div class="author-demo">
            <div>作者：张璐奕</div>
            <div>日期：2017/11/06</div>
        </div>
        <div class="zlst-classic-listTitle clearfix">
            <h3>到货通知单列表<condition-search></condition-search></h3>
        </div>
        <pre style="background-color: #ececec;">
            <code class="html" v-text="htmlCode">
            </code>
        </pre>
        <p style="color:#f00">宽度100%，只有左边标题和右边搜索框</p>
    </div>
</template>

<script>
    import hljs from 'highlight.js'
    export default {
        data () {
            return {
                htmlCode:
                '<div class="zlst-classic-listTitle clearfix">\n'+
                '        <h3>到货通知单列表<condition-search></condition-search></h3>\n'+
                '</div>',
            }
        },

        // 组件被挂载的时候执行的方法
        mounted: function () {
            window.setTimeout(function () {
                $('.classic-demo pre code').each(function(i, block) {
                    hljs.highlightBlock(block);
                });
            }, 0);
        }
    }
</script>
